<template>
  <div id="page-activity">
    <activity-nav></activity-nav>

    <div class="content-wrapper">
      <router-view :activity="activity"></router-view>
    </div>
  </div>
</template>

<script>
  import activityNav from './components/nav'
  import activityApi from '@/api/activity'

  export default {
    name: 'page-activity',
    components: {
      activityNav
    },
    data () {
      return {
        activityId: this.$route.params.activityId,
        pkInitial: this.$route.params.pkInitial,
        activity: {}
      }
    },
    methods: {
      async getActivity () {
        const { body } = await activityApi.info.detail({ pkInitial: this.pkInitial })
        if (this.$apiHelper.requestSuccessed(body.responseCode)) {
          this.activity = body.responseData
        }
      }
    },
    mounted () {
      this.$store.dispatch('collapseNav', true)
      this.$store.dispatch('collapseSubNav', false)
      this.getActivity()
    },
    destroyed () {
      this.$store.dispatch('collapseNav', false)
      this.$store.dispatch('collapseSubNav', true)
    }
  }
</script>

<style lang="less">
  #page-activity {
  }
</style>
